<template>
  <div class="">
    <el-col>
      <el-menu
        default-active="2"
        background-color="#545c64"
        text-color="#fff"
        active-text-color="#ffd04b"
      >
        <div class="s-title">
          <span>图书管理系统</span>
        </div>
        

        <el-submenu index="2">
          <template slot="title">
         
            <span>用户管理</span>
          </template>
          <el-menu-item-group>
            <el-menu-item index="2-1">
              <router-link to="/home/tushu" tag="span">图书管理</router-link>
            </el-menu-item>
          </el-menu-item-group>
          <el-menu-item-group>
            <el-menu-item index="2-2">
              <router-link to="/home/Duzhe" tag="span">读者管理</router-link>
            </el-menu-item>
          </el-menu-item-group>
          <el-menu-item-group>
            <el-menu-item index="2-3">
              <router-link to="/home/Tushufenlei" tag="span">图书分类管理</router-link>
            </el-menu-item>
          </el-menu-item-group>
        </el-submenu>

        <el-submenu index="3">
          <template slot="title">
            
            <span>图书信息</span>
          </template>
          <el-menu-item-group>
            <el-menu-item index="3-1">
              <router-link to="/home/Jieyuexinxi" tag="span">图书借阅信息</router-link>
            </el-menu-item>
          </el-menu-item-group>
          <el-menu-item-group>
            <el-menu-item index="3-2">
              <router-link to="/home/Guihuanxinxi" tag="span">图书归还信息</router-link>
            </el-menu-item>
          </el-menu-item-group>
        </el-submenu>

        
        
      </el-menu>
    </el-col>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {};
  },
  created() {},
  mounted() {},
  watch: {},
  computed: {},
  methods: {}
};
</script>
<style scoped>
.s-title {
  line-height: 70px;
  background-color: rgb(100, 215, 210);
  text-align: center;
  font-size: 16px;
}
</style>